<template>
    <div class="setting-account-safety">
        <h2>修改密码</h2>
        <div class="ivu-mt ivu-pl ivu-pr">
        <Form :model="formData" :label-width="100" ref="form" :rules="rules" >
            <FormItem label="原始密码" prop="old_password">
                <Input v-model="formData.old_password" placeholder="请输入"></Input>
            </FormItem>
            <FormItem label="新密码" prop="new_password">
                <Input v-model="formData.new_password" placeholder="请输入"></Input>
            </FormItem>
            <FormItem label="确认新密码" prop="re_password">
                <Input v-model="formData.re_password" placeholder="请输入"></Input>
            </FormItem>
            <FormItem>
                <Button type="primary" @click="uploadPass">修改</Button>
            </FormItem>
        </Form>
        </div>
    </div>
</template>
<script>
    import { mapState, mapActions } from 'vuex';
    import { rbacmemberchangepassword } from '@/api/hqapi/indexone.js'
    export default {
        data () {
            return {
                formData: {
                    old_password: '',
                    new_password: '',
                    re_password: ''
                },
                rules: {
                    old_password: [
                        { required: true, message: '请输入原密码', trigger: 'blur' }
                    ],
                    new_password: [
                        { required: true, message: '请输入新密码', trigger: 'blur' }
                    ],
                    re_password: [
                        { required: true, message: '请输入确认密码', trigger: 'blur' }
                    ]
                }
            }
        },
        computed: {
            ...mapState('admin/layout', [
                'logoutConfirm'
            ])
        },
        methods: {
            ...mapActions('admin/account', [
                'logout'
            ]),
            uploadPass () {
                this.$refs.form.validate((valid) => {
                    if (valid) {
                        rbacmemberchangepassword(this.formData).then(() => {
                            this.$refs.form.resetFields()
                            this.$Message.success('修改成功')
                            this.logout();
                        })
                    }
                })
            }
        }
    }
</script>
<style lang="less" scoped>
    .setting-account-safety{
        .ivu-col{
            p{
                margin-top: 8px;
                color: #808695;
            }
        }
    }
</style>
